import {React,Dispatch} from 'react';
import { connect } from 'dva';
import styles from './IndexPage.less';
import {IndexModelType} from "../models/example";

interface Props {
  dispatch: Dispatch;
  count:IndexModelType;
}

// const IndexPage:React.FC<Props> = props =>  {
//   const { dispatch, count } = props;
//
//   alert(JSON.stringify(styles)+"1111")
//
//   const IndexPage = () => {
//     return (
//       <div className={styles.normal}>
//         <div className={styles.record}>Highest Record: {count.record}</div>
//         <div className={styles.current}>{count.current}</div>
//         <div className={styles.button}>
//           <button onClick={() => { dispatch({ type: 'count/add' });}}>+</button>
//           <button onClick={() => { dispatch({ type: 'count/minus1' });}}>-</button>
//         </div>
//       </div>
//     );
//   }
//   return IndexPage();
// }

const IndexPage:React.FC<Props> = props =>  {
  const { dispatch, count } = props;

  const IndexPage = () => {
    return (
      <div>
        <div>Highest Record: {count.record}</div>
        <div>{count.current}</div>
        <div>
          <button onClick={() => { dispatch({ type: 'count/add' });}}>+</button>
          <button onClick={() => { dispatch({ type: 'count/minus1' });}}>-</button>
        </div>
      </div>
    );
  }
  return IndexPage();
}

export default connect((state) => ({count: state.count}))(IndexPage);
